<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.w3.org/1999/xhtml">
<head>
    <meta charset="UTF-8">
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <!-- 上述3个meta标签*必须*放在最前面，任何其他内容都*必须*跟随其后！ -->
    <title>Bootstrap 101 Template</title>

    <!-- Bootstrap -->
    <link href="https://cdn.jsdelivr.net/npm/bootstrap@3.3.7/dist/css/bootstrap.min.css" rel="stylesheet">

    <title>Title</title>
</head>

<h1>The Brand Page</h1>
<div>
<!--    查询表单-->
<form>
    <input type="text" name="name"/>
    <button   class="btn btn-primary" type="button" th:onclick="findname()">查询</button>
    <button   class="btn btn-primary" type="button" th:onclick="add()">添加信息</button>
</form>
    <table class="table table-hover">
        <thead>
            <th>ID</th>
            <th>Name</th>
            <th>remark</th>
            <th>createdTime</th>
            <th>operation</th>
        </thead>
        <tbody>
                <tr th:each="bl:${brandList}">
                    <td th:text="${bl.id}"></td>
                    <td th:text="${bl.name}"></td>
                    <td th:text="${bl.remark}"></td>
                    <td th:text="${bl.createdTime}"></td>
                    <td>
                        <button  class="btn btn-danger" type="button" th:onclick="findById([[${bl.id}]])">delete</button>
                        <button  class="btn btn-danger" type="button" th:onclick="dofindById([[${bl.id}]])">update</button>
                    </td>
                </tr>
        </tbody>
    </table>
</div>


<script>
/*查询函数*/
     function findname(){
        let name=document.forms[0].name.value;
        location.href=`http://localhost:8080/brand/findBrandByName/${name}`;
    }
  /*删除*/
  function findById(id){
    location.href=`http://localhost:8080/brand/deleteBrandById/${id}`;
  }
   /*添加*/
  function add(){
    location.href=`http://localhost:8080/brand/addUI`;
  }

  /*
  修改
  1.根据id获取值
  2.修改提交
  */
  function dofindById(id){
    location.href=`http://localhost:8080/brand/doFinfById/${id}`;
  }

</script>



</body>
</html>